<template>
    <div class = "enterpriseCom">
        <h3 class = "h3">企业信息查询</h3>
        <a-form-model class = "qiyefrom" layout = "inline" :model = "enterpriseFrom" :colon = "false">
            <!-- <a-form-model-item label="排放类型">
                <a-select v-model="enterpriseFrom.emissionType" placeholder="请选择地区" allow-clear>
                    <a-icon slot="suffixIcon" type="caret-down" />
                    <a-select-option value="1">类型一</a-select-option>
                </a-select>
            </a-form-model-item> -->
            <a-form-model-item label = "公司名称">
                <a-input v-model = "enterpriseFrom.companyName" placeholder = "请输入公司名称" allow-clear />
            </a-form-model-item>
            <a-form-model-item>
                <a-button type = "primary" @click = "queryBtnFn">查询</a-button>
            </a-form-model-item>
        </a-form-model>
        <div class = "tableclass">
            <my-table style = "height:100%" :columns = "columns" :rowKey = "record=> record.companyName"
                     :data-source = "TableData" :pagination = "false">
                <template slot = "operate" slot-scope = "text,record">
                    <div class = "handle">
                        <span @click = "detailsSubmit(record)" style="cursor: pointer;">详情</span>
                        <span @click = "onDetail(record)" style="margin-left: 10px;cursor: pointer;">数据</span>
                    </div>
                </template>
            </my-table>
            <div class = "content-bottom clearfix">
                <div class = "page-box">
                    <a-pagination :show-total = "total => `共 ${total} 条记录`" v-model = "enterpriseFrom.current"
                                  :total = "total" :defaultPageSize = "enterpriseFrom.size" :item-render = "itemRender"
                                  @change = "pagechangeFn" hideOnSinglePage />
                </div>
            </div>
        </div>
        <!-- 详细信息弹框 -->
        <a-modal v-model = "DetailedPop" width = "70%" title = "企业详细信息" centered destroyOnClose :footer = "null">
            <a-descriptions bordered>
                <a-descriptions-item label = "公司名称">{{DetailedData.companyName?DetailedData.companyName:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "公司类型">{{DetailedData.companyType?DetailedData.companyType:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "公司简称">{{DetailedData.companyShort?DetailedData.companyShort:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "组织机构代码">{{DetailedData.companyCode?DetailedData.companyCode:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "公司法人">{{DetailedData.corporate?DetailedData.corporate:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "公司地址">{{DetailedData.address?DetailedData.address:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "公司邮编">
                    {{DetailedData.companyPostcode?DetailedData.companyPostcode:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "传真">{{DetailedData.fax?DetailedData.fax:"暂无数据"}}</a-descriptions-item>
                <a-descriptions-item label = "联系人">{{DetailedData.contactPerson?DetailedData.contactPerson:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "联系电话">{{DetailedData.contactPhone?DetailedData.contactPhone:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "排行类型">{{DetailedData.emissionType?DetailedData.emissionType:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "控制级别">{{DetailedData.controlLevel?DetailedData.controlLevel:"暂无数据"}}
                </a-descriptions-item>
                <a-descriptions-item label = "所属区划">{{DetailedData.areaId?DetailedData.areaId:"暂无数据"}}
                </a-descriptions-item>
            </a-descriptions>
        </a-modal>

    </div>
</template>

<script>

import company from "@/views/components/mixin/company";
    export default {
        mixins:[company],
        props: {
            equipmentType:{
                type: Number,
                required: true
            },

        },
        name: "enterpriseCom.vue",
        data() {
            return {
                DetailedPop: false, //  详情弹框
                DetailedData: [], // 详情数据
                enterpriseFrom: {
                    current: 1,
                    size: 10,
                    id: "", // 公司名称
                    emissionType: "", // 排行类型
                    controlLevel: "", // 控制类别
                    areaId: "", // 公司区域
                    monitorType:this.equipmentType
                },
                TableData: [], // 分页表格数据
                total: 0, // 设备总条数
                columns: [
                    {
                        title: "序号",
                        dataIndex: "cid",
                        align: "center",
                        width: "80px",
                        customRender: (text, record, index) =>
                            `${
                                (this.enterpriseFrom.current - 1) *
                                this.enterpriseFrom.size +
                                index +
                                1
                            }`,
                    },
                    {
                        title: "公司名称",
                        dataIndex: "companyName",
                        align: "center",
                        ellipsis: true,
                    },
                    {
                        title: "公司简称",
                        dataIndex: "companyShort",
                        align: "center",
                        ellipsis: true,
                    },
                    {
                        title: "联系人",
                        dataIndex: "contactPerson",
                        align: "center",
                        ellipsis: true,
                    },
                    {
                        title: "联系电话",
                        dataIndex: "contactPhone",
                        align: "center",
                        ellipsis: true,
                    },
                    {
                        title: "其他信息",
                        scopedSlots: {
                            customRender: "operate",
                        },
                        align: "center",
                        width: "200px",
                    },
                ],
            };
        },
        methods: {
            // 查询按钮
            queryBtnFn() {
                this.enterpriseFrom.current = 1;
                this.getdata();
            },
            detailsSubmit(data) {
                this.DetailedData = data;
                this.DetailedPop = true;
            },
            onDetail(data) {
                let monitorType=[1,2]
                if(this.equipmentType!=1){
                    monitorType=[this.equipmentType]
                }
                this.setDataMonitoring(data,monitorType)
            },
            // 分页方法
            itemRender(current, type, originalElement) {
                if (type === "prev") {
                    return <a> 上一页 </a>;
                } else if (type === "next") {
                    return <a> 下一页 </a>;
                }
                return originalElement;
            },
            pagechangeFn(page) {
                this.enterpriseFrom.current = page;
                this.getdata();
            },
            getdata() {
                this.$api.postCompanyFindByPage(this.enterpriseFrom).then((res) => {
                    if (res.data.code == 0) {
                        this.TableData = res.data.data;
                        this.total = res.data.total;
                    } else {
                        this.$message.warning(res.data.errorMessage)
                    }
                });
            },
        },
        mounted() {
            this.getdata();
        },
    };
</script>

<style scoped lang = "scss">
    .enterpriseCom {
        width: 100%;
        height: 100%;
        padding: 1%;
        ::v-deep .ant-form-item-control {
            width: 200px;
        }

        .qiyefrom {
            padding: 10px 0;
        }

        .tableclass {
            width: 100%;
            height: 86%;
        }
        .handle{
          span{
            color: #1890ff;
          }
        }
        // 分页
        .page-box {
            float: right;
        }
    }
</style>
